<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

  <button class="btn_get">GET请求</button>
  <button class="btn_delete">delete请求</button>
  <button class="btn_put">put请求的完整写法</button>
  <button class="btn_post2">POST请求的完整写法</button>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  <script>
    axios.defaults.baseURL = 'http://localhost:3000/api/'
    document.querySelector('.btn_get').addEventListener('click', () => {
      axios.get('getaxios3/1001').then(result => {
        console.log(result);
        console.log(result.data);
      }).catch(error => {
        console.log('错误');
      }).finally(() => {
        console.log('最终都会执行的');
      })
    })
    document.querySelector('.btn_delete').addEventListener('click', () => {
      axios.delete('deleteaxios1?id=1').then(result => {
        console.log(result);
        console.log(result.data);
      }).catch(error => {
        console.log('错误');
      }).finally(() => {
        console.log('最终都会执行的');
      })
    })
    document.querySelector('.btn_put').addEventListener('click', () => {
      axios.put('putaxios1', {
        name: '张三',
        age: 12
      }).then(result => {
        console.log(result);
        console.log(result.data);
      }).catch(error => {
        console.log('错误');
      }).finally(() => {
        console.log('最终都会执行的');
      })
    })

  </script>
</body>

</html>